/**
 * @功能描述: 对象描述组件样式文件
 * @author: lzn
 * @date: 2022-09-27 18:59:56
 * @version: 1.0
 */
@import '../../style/index.scss';

// 对象描述组件样式
@include b(descriptions) {
  // 标题样式
  .descriptions-header {
    display: flex;
    align-items: center;
    margin-bottom: 20px;
    font-weight: 700;
    font-size: 16px;
    @include single-ellipsis;
  }
  // 主体样式
  .descriptions-view {
    width: 100%;
    border-radius: 2px;
    table {
      width: 100%;
      table-layout: fixed;
    }
  }
  .descriptions-item {
    vertical-align: top;
  }
  // 每一项添加间隔 
  .descriptions-row>th, .descriptions-row>td {
    padding-bottom: 16px;
  }
  // 定义容器布局
  .descriptions-container {
    display: flex;
  }
  // 内容格式设置
  .descriptions-item-label {
    font-weight: 400;
    text-align: start;
    &::after {
      content: ":";
      position: relative;
      top: -0.5px;
      margin: 0 8px 0 2px;
    }
  }
  // 内容空间设置
  .descriptions-item-content {
    display: table-cell;
    flex: 1;
    word-break: break-word;
    overflow-wrap: break-word;
  }
}


// 带边框组件的额外样式
@include b(descriptions-bordered) {
  .descriptions-view {
    border: $border-base;
    >table {
      table-layout: auto;
      border-collapse: collapse;
    }
  }
  .descriptions-row:not(:last-child) {
    border-bottom: $border-base;
  }
  .descriptions-item-label {
    background-color: #fafafa;
    &::after {
      content: none;
    }
  }
  .descriptions-item-label, .descriptions-item-content {
    padding: 16px 24px;
    border-right: $border-base;
  }
  .descriptions-item-content:last-child {
    border-right: none;
  }
}